const path = Require('path');



var Form = Require(path.join(__dirname, '../../../component/form.js')).form;
var dbConfig = Require(path.join(__dirname, '../../../proxy/dbConfig.js'))();

var formData = [{
    key: 'title',
    'type': 'input',
    boxSetting: { className: 'inputText', lable: '项目标题:', annotate: '注释：显示在项目列表中的名称', size: 'middle', },
    elementSetting: { size: 'middle', jude: { name: '项目标题', rules: ['notNull'] }, placeholder: '请填写', }
},
{
    key: 'PorjectName',
    'type': 'input',
    boxSetting: { className: 'inputText', lable: '项目名称:', annotate: '注释：数据库中对应项目名称,只能输入英文和数字,区分大小写,<br>不能包含空格,特殊字符等', size: 'middle', },
    elementSetting: { size: 'middle', jude: { name: '项目名称', rules: ['notNull', 'isHaveChinese', 'isSpecial'] }, placeholder: '请填写' },

},
{
    key: 'type',
    'type': 'select',
    boxSetting: { className: 'selectText', lable: '类型:', size: 'middle', },
    elementSetting: {
        showNameByDataKey: 'label', setValueByDataKey: 'value',
        data: [{ label: '本地数据库', value: 'local' }, { label: '网络数据库(mongoDB)', value: 'netMongo' }],
        'default': 'local', readonly: false, jude: { name: '类型', rules: ['notNull'] },
        getForm: 'setValueByDataKey', placeholder: '- 请选择 -',
        changeEvent: function (e) { },
    }
}, {
    key: 'ip',
    'type': 'input',
    boxSetting: { className: 'inputText', lable: 'IP地址:', size: 'middle', stutas: 'hide', },
    elementSetting: { size: 'middle', jude: { name: 'IP地址', rules: ['notNull', 'isIp'] }, placeholder: '请填写', }
}, {
    key: 'port',
    'type': 'input',
    boxSetting: { className: 'inputText', lable: '端口号:', size: 'middle', stutas: 'hide', },
    elementSetting: { size: 'middle', jude: { name: '端口号', rules: ['notNull', 'isPort'] }, placeholder: '请填写', }
}, {
    key: 'DBName',
    'type': 'input',
    boxSetting: { className: 'inputText', lable: '数据库名称:', size: 'middle', stutas: 'hide', },
    elementSetting: { size: 'middle', jude: { name: '数据库名称', rules: ['notNull', 'isHaveChinese', 'isSpecial'] }, placeholder: '请填写', }
}, {
    key: 'username',
    'type': 'input',
    boxSetting: { className: 'inputText', lable: '用户名:', size: 'middle', stutas: 'hide', },
    elementSetting: { size: 'middle', jude: { name: '用户名', rules: [] }, placeholder: '请填写', }
}, {
    key: 'password',
    'type': 'input',
    boxSetting: { className: 'inputText', lable: '密码:', size: 'middle', stutas: 'hide', },
    elementSetting: { size: 'middle', jude: { name: '数据库名称', rules: [] }, placeholder: '请填写', }
}, {
    key: 'description',
    'type': 'textarea',
    boxSetting: { className: 'inputText', lable: '备注:', size: 'middle', },
    elementSetting: { jude: { name: '姓名', rules: [] }, readonly: false, changeEvent: function (e) { } }
}];


var contentEX = function () {
    this.defineDate = {
        title: '',
        PorjectName: 'API',
        type: 'local',
        ip: '',
        port: '',
        DBName: '',
        username: '',
        password: '',
        description: '',
    };

    this.form = Form(formData);
    this.form.set(this.defineDate);
    this.setDate = {};
    var _this = this;
    this.form.items.type.options.changeEvent = function (e) {
        e.get(function (error, doc) {
            if (doc == 'local') {
                _this.form.items.ip.layout.hide();
                _this.form.items.port.layout.hide();
                _this.form.items.DBName.layout.hide();
                _this.form.items.username.layout.hide();
                _this.form.items.password.layout.hide();
                _this.form.items.PorjectName.layout.show();
                // console.log(_this.form);
            } else {
                _this.form.items.ip.layout.show();
                _this.form.items.port.layout.show();
                _this.form.items.DBName.layout.show();
                _this.form.items.username.layout.show();
                _this.form.items.password.layout.show();
                _this.form.items.PorjectName.layout.hide();
            }
        });
    };

    this.html = this.form.render();

    this.Creat = $('<div class="Content_button creat">创建项目</div>').click(() => {
        var data = this.get();
        if (data) {
            var r = confirm("是否创建该项目?\n 注:请仔细核实数据库信息")
            if (r) {
                dbConfig.creatDB(data, (e, doc) => {
                    if (e) {
                        alert(e);
                    } else {
                        this.created(doc);
                    };
                });
            };
        };
    });
    this.Delete = $('<div class="Content_button delete">删除项目</div>').click(() => {
        var r = confirm("是否删除项目?")
        if (r) {
            dbConfig.deleteDB(this.setDate.id, (e, doc) => {
                if (e) {
                    alert(e);
                } else {
                    alert('删除成功');
                    this.clear();
                    this.deleted();
                };
            });
        };
    });
    this.UpDate = $('<div class="Content_button updata">更新项目</div>').click(() => {
        var data = this.get();
        if (data) {
            var r = confirm("是否更新项目?")
            if (r) {
                dbConfig.updateDB(this.setDate.id, data, (e, doc) => {
                    if (e) {
                        alert(e);
                    } else {
                        alert('更新成功');
                        this.updated(data);
                    };
                });
            };
        }
    });
    this.Change = $('<div class="Content_button change">切换项目</div>').click(() => {
        var r = confirm("是否切换当前项目?\n注:尚未保存的数据可能会丢失");
        if (r) {
            this.Changed({ id: this.setDate.id });
        };
    });

    var buttons = $('<div class="buttons"></div>');

    this.html.append(buttons);
    buttons.append(this.Creat);
    buttons.append(this.Delete);
    buttons.append(this.UpDate);
    buttons.append(this.Change);

    this.clear();

    this.events = {
        created: [],
        updated: [],
        deleted: [],
        Changed: []
    };

};
contentEX.prototype.render = function () {
    return this.html;
};
contentEX.prototype.clear = function () {
    this.setDate = {};
    this.form.set(this.defineDate);
    this.form.items.ip.layout.hide();
    this.form.items.ip.layout.hideError();
    this.form.items.port.layout.hide();
    this.form.items.port.layout.hideError();
    this.form.items.DBName.layout.hide();
    this.form.items.DBName.layout.hideError();
    this.form.items.username.layout.hide();
    this.form.items.password.layout.hide();
    this.form.items.PorjectName.layout.show();
    this.Creat.css({
        display: 'block'
    });
    this.Delete.css({
        display: 'none'
    });
    this.UpDate.css({
        display: 'none'
    });
    this.Change.css({
        display: 'none'
    });
};
contentEX.prototype.set = function (data) {
    this.clear();
    this.setDate = data;
    this.form.set(data, true);
    this.Creat.css({
        display: 'none'
    });
    this.Delete.css({
        display: 'block'
    });
    this.UpDate.css({
        display: 'block'
    });
    this.Change.css({
        display: 'block'
    });
};
contentEX.prototype.get = function () {
    return this.form.get();
};

contentEX.prototype.on = function (str, event) {
    if (this.events.hasOwnProperty(str)) {
        this.events[str].push(event);
    };
};
contentEX.prototype.created = function (data) {
    for (let i = 0; i < this.events.created.length; i++) {
        const element = this.events.created[i];
        element(this, data);
    };
};
contentEX.prototype.updated = function (data) {
    for (let i = 0; i < this.events.updated.length; i++) {
        const element = this.events.updated[i];
        element(this, data);
    };
};
contentEX.prototype.deleted = function () {
    for (let i = 0; i < this.events.deleted.length; i++) {
        const element = this.events.deleted[i];
        element(this);
    };
};
contentEX.prototype.Changed = function (data) {
    for (let i = 0; i < this.events.Changed.length; i++) {
        const element = this.events.Changed[i];
        element(data, this);
    };
};







// ipc.send('creat-end', { a: 'a', b: 'b' });